@iconSize: 96rpx;
.user-detail {
  width: 622rpx;
  height: 100vh;
  background: #fff;

  &-header {
    padding: 48rpx 32rpx;
    display: flex;
    justify-content: flex-start;
    align-items: center;

    &-favicon {
      width: @iconSize;
      height: @iconSize;
      border-radius: 50%;
      margin-right: 24rpx;
    }
    &-name {
      font-family: PingFangSC-Medium;
      font-size: 32px;
      color: #262626;
      text-align: left;
      line-height: 52px;
      font-weight: 600;
      max-width: 300rpx;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
  }
  &-bottom {
    padding: 24rpx 32rpx 32rpx;
    &-logout {
      width: 100%;
      height: 88rpx;
      font-family: PingFangSC-Regular;
      font-size: 32rpx;
      color: #f23a50;
      text-align: center;
      line-height: 48rpx;
      font-weight: 400;
    }
  }
}
.logout-modal {
  width: 622rpx;
  background: #fff;
  display: flex;
  flex-direction: column;
  &-content {
    padding: 48rpx;
    font-family: PingFangSC-Regular;
    font-size: 32rpx;
    color: #262626;
    text-align: center;
    line-height: 48rpx;
    font-weight: 400;
    border-bottom: 1rpx solid #fafafa;
  }
  &-bottom {
    display: flex;
    height: 96rpx;
    :first-child {
      display: flex;
      justify-content: center;
      align-items: center;
      flex: 1;
      border-right: 1rpx solid #fafafa;
      font-family: PingFangSC-Regular;
      font-size: 32rpx;
      color: #595959;
      text-align: center;
      line-height: 48rpx;
      font-weight: 400;
    }
    :last-child {
      display: flex;
      justify-content: center;
      align-items: center;
      flex: 1;
      border-right: 1rpx solid #fafafa;
      font-family: PingFangSC-Regular;
      font-size: 32rpx;
      color: #f23a50;
      text-align: center;
      line-height: 48rpx;
      font-weight: 400;
    }
  }
}
